<template>
  {{ queryParams.dateRange }}
  <el-form-item label="时间段" prop="platformName">
    <el-date-picker
      v-model="queryParams.dateRange"
      type="daterange"
      align="right"
      format="YYYY-MM-DD HH:mm:ss"
      value-format="YYYY-MM-DD"
      unlink-panels
      range-separator="到"
      start-placeholder="开始日期"
      end-placeholder="结束日期"
      :shortcuts="shortcuts"
    >
    </el-date-picker>
  </el-form-item>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const queryParams = ref({
  dateRange: ['2024-10-05 00:00:00', '2025-04-25 14:36:54'],
})

const shortcuts = ref([
  {
    text: '今天',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 0)
      return [start, end]
    },
  },
  {
    text: '昨天',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 1)
      return [start, end]
    },
  },
  {
    text: '最近7天',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
      return [start, end]
    },
  },
  {
    text: '最近30天',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
      return [start, end]
    },
  },
  {
    text: '本周',
    value: () => {
      const end = new Date()
      const start = new Date()
      const nows = start.getDay() || 7 //注意周日算第一天，如果周日查询本周的话，天数是0，所有如     果是0，默认设置为7
      start.setTime(start.getTime() - 3600 * 1000 * 24 * (nows - 1))
      return [start, end]
    },
  },
  {
    text: '上周',
    value: () => {
      const dataValue = new Date()
      const year = dataValue.getFullYear()
      const month = dataValue.getMonth() + 1
      const day = dataValue.getDate()
      let thisWeekStart //本周周一的时间
      if (dataValue.getDay() == 0) {
        //周天的情况；
        thisWeekStart =
          new Date(year + '/' + month + '/' + day).getTime() - (dataValue.getDay() + 6) * 86400000
      } else {
        thisWeekStart =
          new Date(year + '/' + month + '/' + day).getTime() - (dataValue.getDay() - 1) * 86400000
      }
      const prevWeekStart = thisWeekStart - 7 * 86400000 //上周周一的时间
      const prevWeekEnd = thisWeekStart - 1 * 86400000 //上周周日的时间
      const start = new Date(prevWeekStart) //开始时间
      const end = new Date(prevWeekEnd) //结束时间
      return [start, end]
    },
  },
  {
    text: '本月',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setDate(1)
      return [start, end]
    },
  },
  {
    text: '上月',
    value: () => {
      const start = new Date()
      const end = new Date(start)
      end.setMonth(start.getMonth())
      start.setMonth(start.getMonth() - 1)
      end.setDate(0)
      start.setDate(1)
      return [start, end]
    },
  },
  {
    text: '本季度',
    value: () => {
      const y = new Date().getFullYear() //当前年份
      const m = new Date().getMonth() //当前月份
      const q = Math.floor(m / 3) //当前季度
      const qs = new Date(y, (q - 0) * 3, 1) //上一季度的开始日期
      // const qe = new Date(y, (q+1) * 3, 0);  //上一季度的结束日期
      const qe = new Date() //动态
      //const qe = new Date(y, (q+1) * 3, 0);  //上一季度的结束日期

      //   const currentDate = new Date()
      //   const currentYear = currentDate.getFullYear()
      //   const currentMonth = currentDate.getMonth()

      //   const start = ''
      //   const end = ''
      //   if (currentMonth == 0 || currentMonth == 1 || currentMonth == 2) {
      //     /* 第一季度 */
      //     start = new Date(currentYear, 0, 1)
      //    // end = new Date(currentYear, 2, 31)
      //     end = new Date()
      //   }
      //   if (currentMonth == 3 || currentMonth == 4 || currentMonth == 5) {
      //     /* 第二季度 */
      //     start = new Date(currentYear, 3, 1)
      //     //end = new Date(currentYear, 5, 30)
      //      end = new Date()
      //   }
      //   if (currentMonth == 6 || currentMonth == 7 || currentMonth == 8) {
      //     /* 第三季度 */
      //     start = new Date(currentYear, 6, 1)
      //    // end = new Date(currentYear, 8, 30)
      //     end = new Date()
      //   }
      //   if (
      //     currentMonth == 9 ||
      //     currentMonth == 10 ||
      //     currentMonth == 11
      //   ) {
      //     /* 第四季度 */
      //     start = new Date(currentYear, 9, 1)
      //    // end = new Date(currentYear, 11, 31)
      //     end = new Date()
      //   }
      //end.setHours(23, 59, 59, 0)
      return [qs, qe]

      //https://blog.csdn.net/weixin_44683763/article/details/120481591
    },
  },

  {
    text: '上季度',
    value: () => {
      const y = new Date().getFullYear() //当前年份  https://zhidao.baidu.com/question/1388556289703065980.html 最简单的方法大神就是大神，简单，而且准确
      const m = new Date().getMonth() //当前月份
      const q = Math.floor(m / 3) //当前季度
      const qs = new Date(y, (q - 1) * 3, 1) //上一季度的开始日期
      const qe = new Date(y, q * 3, 0) //上一季度的结束日期

      // const currentDate = new Date()
      //   const currentYear = currentDate.getFullYear()
      //   // 上季度
      //   const currentMonth = currentDate.getMonth() - 3

      //   const start = ''
      //   const end = ''
      //   if (currentMonth == 0 || currentMonth == 1 || currentMonth == 2) {
      //     /* 第一季度 */
      //     start = new Date(currentYear, 0, 1)
      //     end = new Date(currentYear, 2, 31)
      //   }
      //   if (currentMonth == 3 || currentMonth == 4 || currentMonth == 5) {
      //     /* 第二季度 */
      //     start = new Date(currentYear, 3, 1)
      //     end = new Date(currentYear, 5, 30)
      //   }
      //   if (currentMonth == 6 || currentMonth == 7 || currentMonth == 8) {
      //     /* 第三季度 */
      //     start = new Date(currentYear, 6, 1)
      //     end = new Date(currentYear, 8, 30)
      //   }
      //   if (
      //     currentMonth == 9 ||
      //     currentMonth == 10 ||
      //     currentMonth == 11
      //   ) {
      //     /* 第四季度 */
      //     start = new Date(currentYear, 9, 1)
      //     end = new Date(currentYear, 11, 31)
      //   }
      //end.setHours(23, 59, 59, 0)
      return [qs, qe]
    },
  },
  {
    text: '本年',
    value: () => {
      const end = new Date()
      const start = new Date().getFullYear()
      const startYear = new Date(start, 0, 1)
      return [startYear, end]
    },
  },
  {
    text: '上年',
    value: () => {
      //获取当前时间
      const currentDate = new Date()
      //获得当前年份4位年
      const currentYear = currentDate.getFullYear() - 1

      //本年第一天
      const start = new Date(currentYear, 0, 1)
      //本年最后一天
      const end = new Date(currentYear, 11, 31)
      return [start, end]
    },
  },
  //   {
  //     text: "最近一周",
  //     onClick(picker) {
  //       const end = new Date();
  //       const start = new Date();
  //       start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
  //       picker.$emit("pick", [start, end]);
  //     },
  //   },
  //   {
  //     text: "最近一个月",
  //     onClick(picker) {
  //       const end = new Date();
  //       const start = new Date();
  //       start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
  //       picker.$emit("pick", [start, end]);
  //     },
  //   },
  //   {
  //     text: "最近三个月",
  //     onClick(picker) {
  //       const end = new Date();
  //       const start = new Date();
  //       start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
  //       picker.$emit("pick", [start, end]);
  //     },
  //   },
])
</script>

<style scoped></style>
